// 自定义圆饼图配置选项
class SelfEchartOptions {
    // titleStr 标题，updateTime 更新时间，totalAppointNum 预约总数，dataEcharts 图表数据
    constructor({ titleStr = '标题', updateTime = '更新时间', totalAppointNum = 0, dataEcharts = [] }) {
        this.titleStr = titleStr
        this.updateTime = updateTime
        this.totalAppointNum = totalAppointNum
        this.dataEcharts = dataEcharts
    }

    initEchartsOptions() {
        // 图表饼图
        const echartData = {
            title: [
                {
                    // 标题
                    text: this.titleStr,
                    left: 0,
                    textStyle: {
                        fontSize: 16,
                        fontWeight: 600
                    }
                },
                {
                    // 更新时间
                    text: `更新时间：${this.updateTime}`,
                    left: 150,
                    textStyle: {
                        fontSize: 14,
                        fontWeight: 400
                    }
                },
                {
                    text: '单位：辆',
                    right: 0,
                    textStyle: {
                        fontSize: 15,
                        fontWeight: 400
                    }
                }
            ],
            tooltip: {
                show: true,
                trigger: 'item'
            },
            legend: {
                bottom: '3%',
                left: 'center',
                icon: 'circle'
            },
            color: ['#fecc5c', '#5adda8', '#2261E0', '#73c0de', '#3ba272', '#fc8452', '#9a60b4', '#ea7ccc'],
            graphic: {
                elements: [
                    {
                        type: 'text',
                        left: 'center',
                        top: 'center',
                        style: {
                            text: `总预约数`,
                            textAlign: 'center',
                            fill: '#666',
                            width: 30,
                            height: 30,
                            fontSize: 14,
                            fontWeight: 400
                        }
                    },
                    {
                        type: 'text',
                        left: 'center',
                        top: '55%',
                        style: {
                            // 中间总数显示
                            text: `${this.totalAppointNum} 辆`,
                            textAlign: 'center',
                            fill: '#333',
                            width: 30,
                            height: 30,
                            fontSize: 18,
                            fontWeight: 600
                        }
                    }
                ]
            },
            series: [
                {
                    // 标题
                    name: '今日车辆预约数',
                    type: 'pie',
                    radius: ['40%', '70%'],
                    labelLine: {
                        show: true
                    },
                    label: {
                        show: true,
                        position: 'outside',
                        formatter: '{b}：{c}'
                    },
                    emphasis: {
                        scale: true,
                        label: {
                            show: true,
                            fontSize: 18,
                            fontWeight: 'bold'
                        }
                    },
                    itemStyle: {
                        borderRadius: 1,
                        borderColor: '#fff',
                        borderWidth: 4
                    },
                    // 数据
                    data: this.dataEcharts
                }
            ]
        }
        return echartData
    }
}
export { SelfEchartOptions }
